<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@page import="org.springframework.context.ApplicationContext"%>
<%@page import="org.springframework.web.context.support.WebApplicationContextUtils"%>
<%@page import="com.tjtt.tdm.system.action.OrganizationAction"%>
<%@page import="com.tjtt.tdm.system.bean.Organization"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@page import="java.util.List"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>选择用户</title>  
    <%@include file="../jslib/jquerylib.jsp" %>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/web/style/layout.css" />
    <script type="text/javascript" src="<%=request.getContextPath() %>/jslib/jquery.validate.min.js"></script>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/jslib/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css"/>
    <script type="text/javascript" src="<%=request.getContextPath() %>/jslib/ztree/jquery.ztree.core-3.4.js"></script>
    <script type='text/javascript' src="<%=request.getContextPath() %>/jslib/jquery.form.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath() %>/jslib/additional-methods.js"></script> 
    <script type="text/javascript" src="chooseAllUser.js"></script>    
    <script type="text/javascript">
        var treeObj;
		var flag = "1";
		var delflag = "1";
		var chaflag = "1";
		var orgParentId = "";
		var tree_sel=null;
       //--查询名称 高亮 开始---------------------------------------------------------------------
		 function focusKey(e) {
		     if (key.hasClass("empty")) {
		         key.removeClass("empty");
		     }
		 }
		 function blurKey(e) {
		     if (key.get(0).value === "") {
		         key.addClass("empty");
		     }
		 }
		 var lastValue = "", nodeList = [], fontCss = {};
		 
		 function searchNode(e) {
		     var zTree = $.fn.zTree.getZTreeObj("tree");
		     var value = $.trim(key.get(0).value);
		     var keyType = "";
		     keyType = "name";
		     if (lastValue === value) return;
		     lastValue = value;
		     if (value === "") return;
		     updateNodes(false);
		     nodeList = zTree.getNodesByParamFuzzy(keyType, value);
		     updateNodes(true);
		
		 }
		 function updateNodes(highlight) {
		     var zTree = $.fn.zTree.getZTreeObj("tree");
		     for( var i=0, l=nodeList.length; i<l; i++) {
		         nodeList[i].highlight = highlight;
		         zTree.updateNode(nodeList[i]);
		     }
		 }
		 function getFontCss(treeId, treeNode) {
		     return (!!treeNode.highlight) ? {color:"#A60000", "font-weight":"bold"} : {color:"#333", "font-weight":"normal"};
		 }
		 function filter(node) {
		     return !node.isParent && node.isFirstNode;
		 }
		
		 var key;
		 $(document).ready(function(){
		     $.fn.zTree.init($("#tree"), setting, zNodes);
		     key = $("#key");
		     key.bind("focus", focusKey)
		     .bind("blur", blurKey)
		     .bind("propertychange", searchNode)
		     .bind("input", searchNode); 
		 });
		 //--查询名称 高亮 结束---------------------------------------------------------------------
		     
		 <%
		         ApplicationContext context = WebApplicationContextUtils.getWebApplicationContext(application);
		         OrganizationAction organization = (OrganizationAction)context.getBean("organizationAction");
		         List result = organization.getOrganizationTree();
		         String treeNode = "";
		         String orgParentId = "";
		         String orgId = "" ;
		         String orgName = "";
		         String orgDesc = "";
		         for(int i=0;i<result.size();i++){
		             Organization o = (Organization)result.get(i);
		             orgId = o.getOrgId().toString();
		             orgName = (String)o.getOrgName();
		             orgDesc = (String)o.getOrgDesc();
		             orgParentId = o.getOrgParentId().toString();
		             orgDesc = o.getOrgDesc()==null?"":o.getOrgDesc();
		             if("1".equals(orgId)){
		                 treeNode +="{\"id\":"+orgId+",\"pId\":"+orgParentId+",\"name\":\""+orgName+"\",\"title\":\""+orgDesc+"\",\"open\":true},";  
		             }else{
		                 treeNode +="{\"id\":"+orgId+",\"pId\":"+orgParentId+",\"name\":\""+orgName+"\",\"title\":\""+orgDesc+"\",\"open\":false},"; 
		             }
		             
		         }
		         String newTreeNode=treeNode.substring(0,treeNode.length()-1);   
		         System.out.println(newTreeNode);
		     %>
		 var setting = {
		     treeId:'tree',
		     callback: {
		             onClick: zTreeOnClick,
		             beforeCollapse: beforeCollapse,
		             beforeExpand: beforeExpand,
		             onCollapse: onCollapse,
		             onExpand: onExpand
		         },
		     view: {
		         selectedMulti: false
		     },
		     data: {
		         key: {
		             title: "name"
		         },
		         simpleData: {
		             enable: true,
		             idKey: "id",
		             pIdKey: "pId",
		             rootPId: -1
		         }
		                     
		     },
		     view: {
		         fontCss: getFontCss
		     }
		 };
		 function zTreeOnClick(event, treeId, treeNode) {
		     tree_sel = treeNode;
		     var id=treeNode.id;
		      var params = {  
		     "id" : encodeURIComponent(id)
			 	};
		      var postData = $("#gridTable").jqGrid("getGridParam", "postData");
		   $.extend(postData, params);  //(9)将postData中的查询参数覆盖为空值
		  
		  jQuery("#gridTable").jqGrid('setGridParam',
		  {
		      url:common_contextPath+'/system/findUserByOrgId.action'
		  }).trigger("reloadGrid", [{page:1}]); 
		 };
		
		 var zNodes =[
		         <%=newTreeNode%>
		     ];
		 
		     function showIconForTree(tetid, treeNode) {
		         return !treeNode.isParent;
		     };
		     //展开/关闭按钮 开始-----------------------------------------------------------------------
		     var log, className = "dark";
		     function beforeCollapse(treeId, treeNode) {
		         className = (className === "dark" ? "":"dark");
		         showLog("[ "+getTime()+" beforeCollapse ]&nbsp;&nbsp;&nbsp;&nbsp;" + treeNode.name );
		         return (treeNode.collapse !== false);
		     }
		     function onCollapse(event, treeId, treeNode) {
		         showLog("[ "+getTime()+" onCollapse ]&nbsp;&nbsp;&nbsp;&nbsp;" + treeNode.name);
		     }       
		     function beforeExpand(treeId, treeNode) {
		         className = (className === "dark" ? "":"dark");
		         showLog("[ "+getTime()+" beforeExpand ]&nbsp;&nbsp;&nbsp;&nbsp;" + treeNode.name );
		         return (treeNode.expand !== false);
		     }
		     function onExpand(event, treeId, treeNode) {
		         showLog("[ "+getTime()+" onExpand ]&nbsp;&nbsp;&nbsp;&nbsp;" + treeNode.name);
		     }
		     function showLog(str) {
		         if (!log) log = $("#log");
		         log.append("<li class='"+className+"'>"+str+"</li>");
		         if(log.children("li").length > 8) {
		             log.get(0).removeChild(log.children("li")[0]);
		         }
		     }
		     function getTime() {
		         var now= new Date(),
		         h=now.getHours(),
		         m=now.getMinutes(),
		         s=now.getSeconds(),
		         ms=now.getMilliseconds();
		         return (h+":"+m+":"+s+ " " +ms);
		     }
		
		     function expandNode(e) {
		         var zTree = $.fn.zTree.getZTreeObj("tree"),
		         type = e.data.type,
		         nodes = zTree.getSelectedNodes();
		         if (type.indexOf("All")<0 && nodes.length == 0) {
		             alert("请先选择一个父节点");
		         }
		
		         if (type == "expandAll") {
		             zTree.expandAll(true);
		         } else if (type == "collapseAll") {
		             zTree.expandAll(false);
		         } else {
		             var callbackFlag = $("#callbackTrigger").attr("checked");
		             for (var i=0, l=nodes.length; i<l; i++) {
		                 zTree.setting.view.fontCss = {};
		                 if (type == "expand") {
		                     zTree.expandNode(nodes[i], true, null, null, callbackFlag);
		                 } else if (type == "collapse") {
		                     zTree.expandNode(nodes[i], false, null, null, callbackFlag);
		                 } else if (type == "toggle") {
		                     zTree.expandNode(nodes[i], null, null, null, callbackFlag);
		                 } else if (type == "expandSon") {
		                     zTree.expandNode(nodes[i], true, true, null, callbackFlag);
		                 } else if (type == "collapseSon") {
		                     zTree.expandNode(nodes[i], false, true, null, callbackFlag);
		                 }
		             }
		         }
		     }
		     //展开/关闭按钮  结束---------------------------------------------------------------------
		     $(document).ready(function(){
		         treeObj = $.fn.zTree.init($("#tree"), setting, zNodes);
		         $("#expandAllBtn").bind("click", {type:"expandAll"}, expandNode);
		         $("#collapseAllBtn").bind("click", {type:"collapseAll"}, expandNode);
		         
		     }); 
		//下拉树选择组织
		 function beforeClick(treeId, treeNode) {
		     var check = (treeNode && !treeNode.isParent);
		    // if (!check) alert("请选择具体的组织机构");
		     return check;
		 }
		 
		  function onClick(e, treeId, treeNode) {
		      var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
		      nodes = zTree.getSelectedNodes(),
		      v = "";
		      o = "";
		      nodes.sort(function compare(a,b){return a.id-b.id;});
		      for (var i=0, l=nodes.length; i<l; i++) {
		          v += nodes[i].name + ",";
		          o += nodes[i].id + ",";
		      }
		      if (v.length > 0 ) v = v.substring(0, v.length-1);
		      if (o.length > 0 ) o = o.substring(0, o.length-1);
		      var cityObj = $("#citySel");
		      var orgId = $("#orgId");
		      orgId.attr("value",o);
		      cityObj.attr("value", v);
		      hideMenu();
		  }
		  	var treeIsLoad = false;
		  function showMenu() {
		      if(!treeIsLoad){
		          showOrgTree();
		      }    
		     
		      var cityObj = $("#citySel");
		      var cityOffset = $("#citySel").offset();
		      $("#menuContent").css({left:cityOffset.left + "px", top:cityOffset.top + cityObj.outerHeight() + "px"}).slideDown("fast");
		
		      $("body").bind("mousedown", onBodyDown);
		  }
		  function hideMenu() {
		      $("#menuContent").fadeOut("fast");
		      $("body").unbind("mousedown", onBodyDown);
		  }
		  function onBodyDown(event) {
		      if (!(event.target.id == "citySel" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
		          hideMenu();
		      }
		  }
		 
		 	function showOrgTree(){
		      treeIsLoad = true;
		      var setting = {
		          treeId:"orgTree",
		          view: {
		              dblClickExpand: false
		          },
		          data: {
		              simpleData: {
		                  enable: true
		              }
		          },
		          callback: {
		             // beforeClick: beforeClick,
		              onClick: onClick
		          }
		     };
		     var zNodes;
		     $.ajax({  
		            url : common_contextPath+"/organization/searchAllOrg.action",  
		            type : "post", 
		            dataType : "json",  
		            cache : false,  
		            async:false,
		            error : function(textStatus, errorThrown) {  
		                alert("系统ajax交互错误: " + textStatus.value);  
		            },  
		            success : function(data, textStatus) {
		               zNodes = data;
		               $.fn.zTree.init($("#treeDemo"), setting,zNodes);
		            } 
		        });             
		 	}  
				  
    </script>
  </head>
  <body>
  	<table>
  		<tr>
  			<td colspan="3" >
		  		<table border="0" cellpadding="4" cellspacing="1" bgcolor="#b7dbf3" align="left" width="100%">
					<tr>
						<td class="td_label_user">用户名称:</td><td class="td_value"><input type="text" id="userName" style="width: 150px;"/></td>
						<td class="td_label_user">用户工号:</td><td class="td_value"><input type="text" id="loginname" name="loginname" style="width: 150px;"/></td>
						<td class="td_label_user">部门名称:</td>
						<td class="td_value">
						 <input type="hidden" id="orgId" name="orgId" />
		                 <input id="citySel" name="orgNameLabel" type="text"  readonly="readonly" value="--请选择--" style="width:150px;  align:left; height: 20px; border: 1px #cccccc solid; background: url(img/xia_l.png) no-repeat right center; background-color:#FFFFFF;" onclick="showMenu();" />
		            	 <div id="menuContent" class="menuContent"
		                 style="display: none; position: absolute;z-index:10000; background:#f0f6e4; border:1px solid #617775; overflow-y:auto; overflow-x:auto;width:180px;">
		                 <ul id="treeDemo" class="ztree"
		                     style="margin-top: 0; width:170px; height: 200px;z-index:10000;">
		                 </ul>
						</td>
						<td>
							<input type="button" class="button_b" value="查&nbsp;询" onclick="gridSearch()"/>
							<input type="button" class="button_b" value="清&nbsp;空" onclick="reset()"/>
						</td>
					</tr>
				</table>	
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<table id='fromTable'></table><div id='fromPager'></div>
  			</td>
  			<td>
  				<button id="toAll" class="button_b" >&gt;&gt;</button><br />
		        <button id="to" class="button_b" >&nbsp;&nbsp;&gt;</button><br /><br />     
		        <button id="from" class="button_b" >&nbsp;&nbsp;&lt;</button><br />
		        <button id="fromAll" class="button_b" >&lt;&lt;</button><br />
  			</td>
  			<td>
  				<table id='toTable'></table><div id='toPager'></div>
  			</td>
  		</tr>
  		<tr>
  			<td colspan="3" style="text-align: center;background-color:#b7dbf3;">
  				<input type="hidden" id="userid" name="userid" value="<%=request.getParameter("userid") %>"/>
		        <button id="entry" class="button_b">确&nbsp;定</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		        <button id="center" class="button_b">取&nbsp;消</button>
  			</td>
  		</tr>

  	</table>
  </body>
</html>
